﻿<UserControl x:Class="LFSRecord2.View.TimelineView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:lfsvstruct="clr-namespace:LFSRecord2.View.TimelineStructures"
             xmlns:lfsconv="clr-namespace:LFSRecord2.View.Converters"
             xmlns:lfsv="clr-namespace:LFSRecord2.View"
             mc:Ignorable="d" 
             d:DesignWidth="1024" d:DesignHeight="225"
             Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}, Path=ActualWidth}"
             Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}}, Path=ActualHeight}"
             Loaded="UserControl_Loaded">
    <UserControl.Resources>
        <lfsconv:FrameNumTimeStringConverter x:Key="frameNumTimeStringConverter" />
    </UserControl.Resources>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="305" />
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid Grid.Column="0" Name="LayerInfoGrid" MouseLeftButtonDown="OutsideViewer_MouseLeftButtonDown">
            <Grid.RowDefinitions>
                <RowDefinition Height="21" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>

            <Canvas Name="TimelineTime" Grid.Row="0" Background="#ff606060" ClipToBounds="True">
                <!--<Label Name="TimeIndicator" Content="{Binding CurrentFrame, Converter={StaticResource frameNumTimeStringConverter}}" Foreground="#FFEDAA05" Margin="0, -4, 0, 0" FontSize="16" FontFamily="Myriad Pro" />-->
            </Canvas>

            <Grid Grid.Row="1" ClipToBounds="True" MouseWheel="ScrollViewer_MouseWheel">
                <StackPanel Name="InfoViewStackPanel"
                            Grid.Row="1"
                            Background="#ff787878"
                            Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=ActualWidth}"
                            Orientation="Vertical"
                            AllowDrop="True" DragOver="InfoViewStackPanel_DragOver" Drop="InfoViewStackPanel_Drop">
                    <ItemsControl ItemsSource="{Binding AllLayers}" Focusable="False">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=ActualWidth}">
                                    <lfsv:TimelineLayerInfoView DataContext="{Binding}" />
                                </StackPanel>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                    <ItemsControl ItemsSource="{Binding AllAudioLayers}" Focusable="False">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=ActualWidth}">
                                    <lfsvstruct:TimelineAudioLayerInfoView DataContext="{Binding}" />
                                </StackPanel>
                            </DataTemplate>
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>
                </StackPanel>
            </Grid>
        </Grid>

        <Grid Name="KeyGrid" Grid.Column="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="18" />
            </Grid.ColumnDefinitions>

            <Line Grid.Column="0" Grid.ColumnSpan="2"
                        X1="0" X2="{Binding ElementName=KeyGrid, Path=ActualWidth}"
                          Y1="0.5" Y2="0.5" Stroke="#FFACACAC" StrokeThickness="1" IsHitTestVisible="False" />
            <Line Grid.Column="0" Grid.ColumnSpan="2"
                        X1="0" X2="{Binding ElementName=KeyGrid, Path=ActualWidth}"
                          Y1="20.5" Y2="20.5" Stroke="#FF616161" StrokeThickness="1" IsHitTestVisible="False" />

            <ScrollViewer Grid.Column="0" 
                          VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Visible" 
                          Focusable="False"
                          SnapsToDevicePixels="True" UseLayoutRounding="True"
                          MouseLeftButtonDown="OutsideViewer_MouseLeftButtonDown">
                <Grid Name="TimelineKeyArea">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="21" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>

                    <Canvas Name="TimelineRuler" Grid.Row="0" Background="Transparent" HorizontalAlignment="Left" MouseLeftButtonDown="TimelineRuler_MouseDown" />

                    <Grid Grid.Row="1" ClipToBounds="True" 
                          SizeChanged="VerticalScrollGrid_SizeChanged" 
                          MouseLeftButtonDown="KeyViewGrid_MouseLeftButtonDown" 
                          MouseWheel="ScrollViewer_MouseWheel">
                        <StackPanel Name="KeyViewStackPanel" 
                                    Width="{Binding ElementName=TimelineRuler, Path=ActualWidth}" 
                                    Background="#FF8D8D8D" 
                                    HorizontalAlignment="Left" VerticalAlignment="Top" 
                                    SizeChanged="VerticalScrollGrid_SizeChanged">
                            <ItemsControl ItemsSource="{Binding AllLayers}" Focusable="False">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=ActualWidth}">
                                            <lfsv:TimelineLayerKeyView DataContext="{Binding}" />
                                        </StackPanel>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                            <ItemsControl ItemsSource="{Binding AllAudioLayers}" Focusable="False">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal" Width="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Grid}}, Path=ActualWidth}">
                                            <lfsvstruct:TimelineAudioLayerDataView DataContext="{Binding}" />
                                        </StackPanel>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </StackPanel>
                    </Grid>

                    <lfsvstruct:TimelinePointer x:Name="TimePointer" 
                                                Grid.RowSpan="2" 
                                                VerticalAlignment="Top" 
                                                HorizontalAlignment="Left" 
                                                Margin="-6,1,0,0"
                                                SnapsToDevicePixels="True"
                                                MouseDown="TimePointer_MouseDown" />
                    <Canvas Name="TimelineOverlayCanvas" Grid.Row="1" ClipToBounds="True" IsHitTestVisible="False" />
                </Grid>
            </ScrollViewer>

            <ScrollBar Grid.Column="1" Margin="0, 21, 0, 17" 
                       Name="TimelineVerticalScrollBar"
                       HorizontalAlignment="Right" VerticalAlignment="Stretch"
                       Scroll="TimelineVerticalScrollBar_Scroll" LargeChange="0.4" SmallChange="0.2" />
        </Grid>
    </Grid>
</UserControl>
